<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="<%=request.getContextPath()%>/resources/js/jquery-1.9.1.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<script src="<%=request.getContextPath()%>/resources/js/filter.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/css/bootstrap-combined.min.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="screen"
	href="http://tarruda.github.com/bootstrap-datetimepicker/assets/css/bootstrap-datetimepicker.min.css">
<script type="text/javascript"
     src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.2.2/js/bootstrap.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.min.js">
    </script>
    <script type="text/javascript"
     src="http://tarruda.github.com/bootstrap-datetimepicker/assets/js/bootstrap-datetimepicker.pt-BR.js">
    </script>
    
<style>

.inputFilter {
	width: 200px;
	height: 30px !important;
}
</style>
<div class="menuFilter">
	<form action="events" method="POST">
	<table>		
		<tr>
			<td>IP</td>
			<td><input type="text" name="ip" value="${ip}" class="inputFilter"/></td>
		</tr>
		<tr>
			<td>Port</td>
			<td><input type="text" name="port" value="${port}" class="inputFilter"/></td>
		</tr>
		<tr>
			<td>Method</td>
			<td>
				<c:set var="method" value="${method}"/>
				<select class="inputFilter" name="method">
				    <c:forEach items="${methods}" var="method1">
				        <option value="${method1}" ${method1 == method ? 'selected' : ''}>${method1}</option>
				    </c:forEach>
				</select>			
			</td>
		</tr>
		<tr>
			<td>Pattern</td>
			<td>
				<c:set var="pattern" value="${pattern}"/>
				<select class="inputFilter" name="pattern">
				    <c:forEach items="${patterns}" var="pattern1">
				        <option value="${pattern1}" ${pattern1 == pattern ? 'selected' : ''}>${pattern1}</option>
				    </c:forEach>
				</select>			
			</td>
		</tr>
		
		<tr>
			<td>From</td>
			<td>
			<div id="fromDate"  class="input-append date inputFilter">
				<input type="text" name="fromDate" value="${fromDate}" style="width: 173px;" class="inputFilter"/>
			<span class="add-on">
				<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
			</span>	
			</div>
			
			</td>
		</tr>
		<tr>
			<td>To</td>
			<td>
			<div id="toDate"  class="input-append date inputFilter">
				<input type="text" name="toDate" value="${toDate}" style="width: 173px;" class="inputFilter"/>
			<span class="add-on">
				<i data-time-icon="icon-time" data-date-icon="icon-calendar"></i>
			</span>	
			</div>
			
			</td>
		</tr>
		
		<tr><td></td><td><input type="submit" value="Filter"/></td></tr>
	</table>
	</form>

	<script type="text/javascript">
      $('#fromDate').datetimepicker({
        format: 'yyyy-MM-dd hh:mm:ss',
        language: 'en'
      });
	  $('#toDate').datetimepicker({
        format: 'yyyy-MM-dd hh:mm:ss',
        language: 'en'
      });
    </script>
  
</div>

